<template>
    <div class="container">
        <el-row class="xh_el">
           <el-col :span="3" class="clo_left nav">
			   <el-menu class="top1">
					<h2>智能选校系统</h2> 
					<dl>
						<dt><img src="../assets/images/yh.png"></dt>
						<dd>{{userName}}</dd>
					</dl>
				</el-menu>
				 <el-menu  class="el-menu-vertical-demo" :default-active="$route.path.replace('/','')"  router>
					<el-menu-item class="shouye" index="index"><i class="el-icon-message"></i>首	页</el-menu-item>
					<el-menu-item index="userManage"><i class="el-icon-menu"></i>用户管理</el-menu-item>
					<el-menu-item index="suggestManage"><i class="el-icon-view"></i>建议管理</el-menu-item>
					<el-menu-item index="systemSetting"><i class="el-icon-setting"></i>系统设置</el-menu-item>
					<el-menu-item index="logOff" ><i class="el-icon-minus"></i>退出登录</el-menu-item>
				</el-menu>
			</el-col>
            <el-col :span="21" class="cont">
                 <router-view></router-view>
            </el-col>
        </el-row>
    </div>
</template>
<script>
export default {
	name:"index",
	data(){
		return {
			userName:''
		}
	},
	mounted(){
		this.userName = localStorage.user;
	}
}
</script>
<style>
		body{
		height: 100%;
		width: 100%;
		background: #fff;
	}
	.nav{
        padding-top: 20px;
        background: #324157;
        height: calc(100% - 20px);
    }
	.xh_el,.container{
		height: 100%;
	}
	.clo_left{
		background:rgb(50, 62, 87);
		overflow-x: hidden;		
		overflow-y: auto;
	}
	.clo_left ul{
		background:rgb(31, 43, 61);
	}
	.clo_left ul li{
		color: #bfcbd9;
		text-align: center;
	}
	.clo_left ul li.shouye{
		padding-left: 0!important;
	}
	.top1{
		height:200px;
		color: #fff;
		margin-top:30px;
		text-align: center;
	}
	.top1 h2{
		font-size: 20px;
		margin: 25px auto 20px auto;
	}
	.top1 dt img{
		width:50px;
		height: 50px;
		display: block;
		margin: 10px auto;
	}
	ul.top1{
		background: none;
	}
	.el-menu-item:hover{
		background:#66707e!important;
	}
	.cont{
		height: 100%;
	}
</style>

